<meta charset="utf-8" />	
<form class="form-horizontal" role="form"  onsubmit="return addFunction(this);" >
 <table id="functionAddTable"></table>
 <div id="btn-add" class="btn btn-info" style='margin-top:20px' onclick="addTable()"> 
				新增列
			</div>
			<div id="btn-delete" class="btn btn-info" style='margin-top:20px' onclick="removeTable()"> 
				删除列
			</div>
 <div class="form-actions align-right  form-button-box" style="margin-top: 10px">
			<button id="btn-save" class="btn btn-info" type="submit">
				保存
			</button>
			&nbsp; 
			<button class="btn" type="button" onclick="javascript:dialog.close(this);">
				 关闭
			</button>
		</div>
</form>
<script type="text/javascript">
var date={0:{id:'custId',value:'客户编号',width:'200px',type:'text'},
		  1:{id:'agentId',value:'商户合作商',width:'200px',type:'search_input',location:'mpomng/function/selectAgentList.do'},
		  2:{id:'cooporgNo',value:'渠道名称',width:'200px',type:'search_input',location:'mpomng/function/selectCooporgList.do'},
		  3:{id:'funcId',value:'功能名称',width:'200px',type:'search_input',location:'mpomng/function/selectFuncList.do'},
		  4:{id:'optionId',value:'选项名称',width:'200px',type:'search_input',location:'mpomng/function/selectOptionList.do'},
		  5:{id:'funcOptionValue',value:'功能选项值',width:'200px',type:'text'}};
var queryList=[];
jQuery(function($) {
	for(var i=0;i<Object.keys(date).length;i++){
		if(date[i].type=='search_input'){
			searchInputFormat(date[i].location,date[i].id,date[i].value,date[i].width);
		}
	}
});
function addTable(){
	var tr=$('<tr></tr>').addClass("functionAddTr");
	if(($('#functionAddTable').find('tr').length)%2==0){
		tr.attr('style','background-color:#e9e9e9;height:42px');
	}else{
		tr.attr('style','height:42px');
	}
	var initTd=$('<td style=\'width:50px;border: #c7c4c4 1px solid;\'></td>');
	initTd.append($('<div style=\'margin-left:10px;float:left\' id=\'functionDiv\'>'+($('#functionAddTable').find('tr').length+1)+'</div>'))
	.append($('<div style=\'float:left;margin-left:10px\'>'+getInputText('checkbox','','','checkbox_'+($('#functionAddTable').find('tr').length+1))+'</div>'))
	.appendTo(tr);
	for(var i=0;i<Object.keys(date).length;i++){
		if(date[i].type=='search_input'){
			tr.append($('<td style=\'border: #c7c4c4 1px solid;\'>'+getSearchData(date[i].id)+'</td>').addClass("functionAddTd"));
		}else{
			tr.append($('<td style=\'border: #c7c4c4 1px solid;\'>'+getInputText(date[i].type,date[i].value,date[i].width,date[i].id)+'</td>').addClass("functionAddTd"));
		}
	}
	$('#functionAddTable').append(tr);

}
function getSearchData(id){
	for(var i =0;i<queryList.length;i++){
		if(id==queryList[i].id){
			return queryList[i].value;
		}
	}
}

function searchInputFormat(location,id,value,width){

	$.ajax({
		type : "post",
		url : location,
		async: false,
		dataType : 'json',
		success : function(result) {
			if (result.rspcod != 200) {
				msg.alert("错误", result.rspmsg + " 错误代码："
						+ result.rspcod, 'error');
			} else {
				var returnData;
				returnData='<select rel=\'obj.options\' location=\''+location+'\' name=\''+id+'\' id=\'search_'+id+'\' data-placeholder=\'请选择'+value+'\' style=\'width:'+width+';vertical-align:middle;\'><option value=\'\' >----请选择'+value+'----</option>';
				for(var i=0;i<$.parseJSON(result.obj).options.length;i++) {
					returnData=returnData+'<option value=\''+$.parseJSON(result.obj).options[i].value+'\' >'+$.parseJSON(result.obj).options[i].text+'</option>';
				}
				returnData=returnData+'</select>';
				queryData={
						id:id,
						value:returnData
				};
				queryList.push(queryData);
			}
		},
		error : function(XMLHttpRequest, textStatus) {
			msg.alert("错误", "错误代码：" + XMLHttpRequest.status + ",错误描述："
					+ textStatus, 'error');
		}
	});
}
function removeTable(){
	var checkBoxList=$('#functionAddTable').find('input[type=\'checkbox\']');
	for(var i=0;i<checkBoxList.length;i++){
		if(checkBoxList[i].checked){
			$(checkBoxList[i]).parent().parent().parent().remove();
		}
	}
	refreshTable();
}
function refreshTable(){
	var functionAddTableList=$('#functionAddTable').find('tr');
	for(var i=0;i<functionAddTableList.length;i++){
		if(i%2==0){
			$(functionAddTableList[i]).attr('style','background-color:#e9e9e9;height:42px');
		}else{
			$(functionAddTableList[i]).attr('style','height:42px');
		}
		$(functionAddTableList[i]).find('#functionDiv').html(i+1);
	}
}
function getInputText(inputType,placeholderValue,width,id){
	return '<input type=\''+inputType+'\' placeholder=\'请输入'+placeholderValue+'\' id=\''+id+'\' style=\'width:'+width+'\'/>';
}
function addFunction(obj){
	var jsonList=[];
	var functionAddTableList=$('#functionAddTable').find('tr');
	for(var i=0;i<functionAddTableList.length;i++){
		var jsonData={
				'custId':$(functionAddTableList[i]).find('#custId').val(),
				'agentId':$(functionAddTableList[i]).find('#search_agentId option:selected').val(),
				'cooporgNo':$(functionAddTableList[i]).find('#search_cooporgNo option:selected').val(),
				'funcId':$(functionAddTableList[i]).find('#search_funcId option:selected').val(),
				'optionId':$(functionAddTableList[i]).find('#search_optionId option:selected').val(),
				'funcOptionValue':$(functionAddTableList[i]).find('#funcOptionValue').val()
		};
		jsonList.push(jsonData);
	}
	$.ajax({
	       url:'mpomng/function/saveFunctionOption.do', 
	       type:'post',         
	       dataType:'json',    
	       contentType:"application/json",
	       data:JSON.stringify(jsonList),        
	       success : function(result) {
				if (result.rspcod != "200") {
					msg.alert("错误", result.rspmsg + " 错误代码："
							+ result.rspcod, 'error');
				} else {
					msg.alert("提示", result.rspmsg, 'correct');
					$("#grid-table").trigger("reloadGrid");
					dialog.close(obj);
				}
			},
		  error:function(XMLHttpRequest, textStatus){
			  $msg.alert("错误", textStatus + " 错误代码："
						+ XMLHttpRequest.status, 'error');
			}
	     });
	
	return false;
}
</script>

